<?php echo $this->headStyle("body {
            background-color: #376daa;
        }
        .card {
            text-align: center;
            color: #204167;
            text-shadow: #3F80CA 0 1px 0;
            font-size: 72px;
            padding: 80px 40px;
        }

        .x-phone .card {
            padding: 15px;
            font-size: 36px;
        }

        .card p {
            font-size: 24px;
            line-height: 30px;
        }

        .x-phone .card p {
            font-size: 16px;
            line-height: 18px;
        }") ?> 

<?php echo $this->headScript()->captureStart(); ?>
Ext.setup({    
    icon: 'icon.png',
    glossOnIcon: false,
    onReady: function() {
        var carousel1 = new Ext.Carousel({
            defaults: {
                cls: 'card'
            },
            items: [
            {
                html: '<h1>hello my boss</h1><img src="/upload/h1.png">'
            },
            {                
                html: '<img src="/upload/h2.png">'
            },
            {                
                html: '<img src="/upload/h3.png">'
            },
            {                
                html: '<img src="/upload/h4.png">'
            }]
        });    
        var panel = new Ext.TabPanel({
            fullscreen: true,            
            cardSwitchAnimation: 'slide',            
            items: [carousel1]
        });
    }
});
<?php echo $this->headScript()->captureEnd(); ?>
